<template>
    <div class="personCener">
        <div class="left">
            <img :src="user.avatar" alt="">
            <p>{{this.user.nickname}}</p>
            <p><router-link :to="{name:'center'}" style="color:white">个人中心</router-link></p>
            <p style="color:white" @click="getList">积分商城</p>
            <p><router-link :to="{name:'login'}" style="color:white">退出</router-link></p>
        </div>
        <router-view class="right"></router-view>
    </div>
</template>


<script>
import {get} from '../../utils/fecth'
export default {
    name:'personCener',
    data() {
        return {
            user:JSON.parse(localStorage.getItem('a')),
            list:[]
        }
    },
    created() {
        // console.log(this.user)
        // this.getList()
    },
    methods: {
        async getList(){
            const data = await get('/shop/shopList')
                    this.$store.list = data
                    localStorage.setItem('list',JSON.stringify(data))
                    this.$router.push({
                    name:'shopping'
                })
               // console.log(this.$store.list)
            console.log(data)
        }
    },
}
</script>

<style lang="scss">
.personCener{
    width: 100%;
    height: 100%;
    display: flex;
    .left{
        height: 100%;
        text-align: center;
        line-height:50px;
        width: 20%;
        background-color: rgb(58, 55, 55);
        color: white;
        position:absolute;
        img{
            margin-top: 40px;
            width: 80px;
            border-radius: 50%;
        }
    }
    .right{

        width: 80%;
        position:absolute;
        left: 20%;
    }
}
    
</style>